<template>
  <div v-if="item.status === 'onsell' ">
    <div class="goodsrig">{{btnTxt}}</div>
  </div>
  <div v-else-if="item.status === 'soldout' ">
    <div :class="{ prepay:item.status === 'soldout'}">{{btnTxt}}</div>
  </div>
</template>

<script>
export default {
    props:['item'],

    computed:{
        btnTxt(){
            return this.item.status === 'onsell' ? '去开团' : '已抢光'
        }
    }
}
</script>

<style lang='stylus' scoped>
.goodsrig{
    width: 90px;
    height: 26px;
    border: .0625rem solid #fe4070;
    background: #fe4070;
    border-radius: 25px;
    text-align: center;
    line-height: 26px;
    box-sizing: border-box;
    color: #fff;
    font-size: 13px;
}
.prepay{
    width: 90px;
    height: 26px;
    border: .0625rem solid #d1d1d1;
    border-radius: 25px;
    text-align: center;
    line-height: 26px;
    box-sizing: border-box;
    color: #a9a9a9;
    font-size: 13px;
}

</style>